<template>
  <!-- 信息录入 -->
  <div class="box">
    <OrderInformation :orderNumber="orderNumber"></OrderInformation>
    <div class="enterInfor">
      <table>
        <tr>
          <td rowspan="3" width="150" class="left">客户信息</td>
          <td width="150" class="title">购房人姓名</td>
          <td>{{ showForm.basicBorrowerName }}</td>
          <td width="150" class="title">身份证号码</td>
          <td>{{ showForm.basicBorrowerCard }}</td>
          <td width="150" class="title">联系电话</td>
          <td>{{ showForm.basicBorrowerPhone }}</td>
          <td width="150" class="title"></td>
          <td></td>
        </tr>
        <tr>
          <td width="150" class="title">售房人姓名</td>
          <td>{{ showForm.buyName }}</td>
          <td width="150" class="title">身份证号码</td>
          <td>{{ showForm.buyCard }}</td>
          <td width="150" class="title">联系电话</td>
          <td>{{ showForm.buyPhone }}</td>
          <td width="150" class="title"></td>
          <td></td>
        </tr>
      </table>

      <table>
        <tr>
          <td rowspan="3" width="150" class="left">不动产信息</td>
          <td width="150" class="title">抵押人姓名</td>
          <td>{{ showForm.pledgeName }}</td>
          <td width="150" class="title">身份证号码</td>
          <td>{{ showForm.pledgeCard }}</td>
          <td width="150" class="title">联系电话</td>
          <td>{{ showForm.pledgePhone }}</td>
          <td width="150" class="title">不动产地址</td>
          <td>{{ showForm.pledgeHouseAddress }}</td>
        </tr>
        <tr>
          <td width="150" class="title">不动产产权号</td>
          <td>{{ showForm.pledgeHouseNumber }}</td>
          <td width="150" class="title">所属区域</td>
          <td>{{ showForm.pledgeHouseDistrict }}</td>
          <td width="150" class="title">小区名字</td>
          <td>{{ showForm.pledgeHouseName }}</td>
          <td width="150" class="title">建站面积(m²)</td>
          <td>{{ showForm.pledgeHouseArea }}</td>
        </tr>
        <tr>
          <td width="150" class="title">合同成交价(万元)</td>
          <td>{{ showForm.advanceMoney }}</td>
          <td width="150" class="title"></td>
          <td></td>
          <td width="150" class="title"></td>
          <td></td>
          <td width="150" class="title"></td>
          <td></td>
        </tr>
      </table>

      <table>
        <tr>
          <td width="150" class="left">按揭信息</td>
          <td width="150" class="title">批款额度(万元)</td>
          <td>{{ showForm.lendingAmount }}</td>
          <td width="150" class="title"></td>
          <td></td>
          <td width="150" class="title"></td>
          <td></td>
          <td width="150" class="title"></td>
          <td></td>
        </tr>
        <tr>
          <td width="150" class="left">财务信息</td>
          <td width="150" class="title">收费金额(元)</td>
          <td>{{ showForm.chargeMoney }}</td>
          <td width="150" class="title">实际收费时间</td>
          <td>{{ showForm.chargeTime }}</td>
          <td width="150" class="title"></td>
          <td></td>
          <td width="150" class="title"></td>
          <td></td>
        </tr>
      </table>

      <table>
        <tr style="height:100px">
          <td width="150" class="left">备注</td>
          <td colspan="8" class="bz">
            {{ showForm.postscript }}
          </td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>
import OrderInformation from "@/components/business/OrderInformation";
import { getordinaryMort } from "../../../src/assets/js/api";
export default {
  name: "Information",
  created() {
    //获取各数据字典
    this.orderNumber = this.orderNumber = sessionStorage.getItem("orderNumber");
    this.getAccInfo();
  },
  components: { OrderInformation },
  data() {
    return {
      orderNumber: "",
      showForm: {},
      agencySaveTime: []
    };
  },
  computed: {
    showFormmate: function() {
      if (this.showForm.basicBorrowerMarriage == "未婚") {
        return false;
      } else {
        return true;
      }
    }
  },
  methods: {
    //获取录入信息
    getAccInfo() {
      getordinaryMort(this.orderNumber).then(res => {
        this.showForm = res.data;
      });
    }
  }
};
</script>
<style scoped type="less">
.enterInfor table {
  width: 100%;
  margin-bottom: 10px;
  word-break: break-all;
}
.enterInfor table {
  border-collapse: collapse;
  table-layout: fixed;
  border: none;
}
.enterInfor table td {
  padding: 5px 0;
  font-size: 14px;
  color: #333333;
  text-align: left;
  padding-left: 10px;
  border: 1px rgb(121, 121, 121) solid;
}
::v-deep .el-range-editor--small.el-input__inner {
  width: 210px;
}
.enterInfor .left {
  font-size: 14px;
  font-weight: bold;
  color: rgba(51, 51, 51, 1);
  text-align: center;
  padding: unset;
}
.enterInfor .title {
  background: rgba(59, 157, 248, 0.06);
}
.enterInfor .bz {
  padding: unset;
  vertical-align: unset;
  line-height: 24px;
  text-indent: 2em;
}
</style>
